{% extends 'encyclopedia/base.html' %}

{% block title %}{{ category.name }} - 相机分类 - 相机百科{% endblock %}

{% block content %}
    <div class="card mb-4">
        <div class="card-header bg-primary text-white">
            <h1 class="card-title">{{ category.name }}</h1>
        </div>
        <div class="card-body">
            {% if category.description %}
                <p class="card-text mb-4">{{ category.description }}</p>
            {% endif %}
            <p class="text-muted">包含 {{ cameras.count }} 个相机词条</p>
        </div>
    </div>

    <h2 class="mb-4">相机列表</h2>
    <div class="row">
        {% for camera in cameras %}
            <div class="col-md-6 col-lg-4">
                <div class="card">
                    <div class="card-body">
                        <h5 class="card-title">{{ camera.title }}</h5>
                        <h6 class="card-subtitle mb-2 text-muted">品牌：{{ camera.brand }}</h6>
                        <p class="card-text">{{ camera.content|truncatechars:100 }}</p>
                        <div class="d-flex justify-content-between">
                            <a href="{% url 'encyclopedia:camera_detail' camera.id %}" class="btn btn-primary">查看详情</a>
                            <a href="{% url 'encyclopedia:camera_edit' camera.id %}" class="btn btn-secondary">编辑</a>
                        </div>
                    </div>
                    <div class="card-footer text-muted">
                        创建于：{{ camera.created_at|date:"Y-m-d" }}
                    </div>
                </div>
            </div>
        {% empty %}
            <div class="col-12">
                <div class="alert alert-warning" role="alert">
                    该分类下暂无相机信息。
                </div>
            </div>
        {% endfor %}
    </div>

    <div class="mt-4">
        <a href="{% url 'encyclopedia:category_list' %}" class="btn btn-secondary">返回分类列表</a>
    </div>
{% endblock %}